<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="../../../../common/common.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="${ctx}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/dist/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/plugins/datatables/css/matrix-style.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/dist/css/AdminLTE.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/plugins/datatables/css/dataTables.bootstrap.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/plugins/validationEngine/css/validationEngine.jquery.css" rel="stylesheet"
          type="text/css">
    <link href="${ctx}/static/plugins/layer/skin/default/layer.css" rel="stylesheet" type="text/css"/>
    <style type="text/css">
        .btn-sm {
            border-width: 4px;
            font-size: 13px;
            padding: 4px 9px;
            line-height: 1.39;
        }

        .code_space {
            margin-left: -4px;
            margin-right: 14px;
        }

        .btn_key {
            background-color: #6fb3e0 !important;
            border-color: #6fb3e0;
        }

        .btn_key:hover {
            color: #fff;
            background-color: #39b3d7;
            border-color: #269abc;
        }

        .code_width {
            width: 36.5%;
        }

        @media only screen and (max-width: 767px ) {
            .code_width {
                width: 102%;
            }
        }

        .radios {
            margin-bottom: 20px;
            float: left;
            margin-left: 40px;
        }
        .left{
        	float:left; width:44%; height:100%; 
        }
        .right{
        	float:left; width:56%;height:100%; 
        }
        .form-control{
        	width:250px;
        }
		.image-control{
			width: 200px;
			height: 100px;
			border: solid thin seashell;
			background-color: gainsboro;
		}
    </style>
</head>
<body>

<div id="divCenter" align="center"
     style="position: absolute; z-index: 9; display: none; width:1241px; height:700px;left:0px;top:0px;">
    <div style="text-align: center"><a class="btn btn-success" href="javascript:void(0);" onclick="picClose();">关闭</a>
    </div>
    <img id="bigImg" src=""/>

</div>

<div class="content">
	
    <form class="form-horizontal" id="addForm" action="/api/agent/listPage">
	    <br>
		<br>
		<br>
        <div class="all" style="float:inherit;margin-top: -30px">
			<div class="left">
		        <div class="form-group">
		            <label for="roleName" class="col-sm-4 control-label">代理级别:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.levelName}</span>
		            </div>
		        </div>
		          <div class="form-group">
		            <label for="roleCode" class="col-sm-4 control-label">代理商名称:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.agentName}</span>
		            </div>
		        </div>
		        <div class="form-group">
		            <label for="roleCode" class="col-sm-4 control-label">联系人:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.personName}</span>
		            </div>
		        </div>
		          <div class="form-group">
		            <label for="description" class="col-sm-4 control-label">联系电话:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.personTel}</span>
		            </div>
		        </div>
		         <div class="form-group">
		            <label for="description" class="col-sm-4 control-label">所属区域:</label>
		            <div class="col-sm-3">
						<span style="line-height: 47px">${agent.provinceName}-${agent.cityName}-${agent.countyName}</span>
		            </div>
		        </div>
				<div class="form-group" id="communityIsAble">
		            <label for="description" class="col-sm-4 control-label">所属社区:</label>
		            <div class="col-sm-3">
						<span style="line-height: 47px">${agent.townName}</span>
		            </div>
		        </div>
		         <div class="form-group">
		            <label for="description" class="col-sm-4 control-label">详细地址:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.address}</span>
		            </div>
		        </div>
		        <div class="form-group">
		            <label for="description" class="col-sm-4 control-label">推广师电话:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.promoterTel}</span>
		            </div>
		        </div>
		        <div class="form-group">
		            <label for="description" class="col-sm-4 control-label">推广师姓名:</label>
		            <div class="col-sm-3">
                        <span style="line-height: 47px">${agent.promoterName}</span>
		            </div>
		        </div>
	       </div>
            <div class="right" style="margin-top: 57px">
			   <div class="form-group">
				   <label for="businessNumber" class="col-sm-4 control-label">营业执照:</label>
				   <div class="col-sm-3">
                       <span style="line-height: 47px">${agent.businessNumber}</span>
				   </div>
				   <div style="clear: both"></div>
				   <div style="clear: both;width: 500px;margin-left: 162px;margin-top: 10px">
                       <div class="image-control" onclick="picBig('${agent.businessImage[0].url}')"
                            style="background-image: url('${agent.businessImage[0].url}');background-size: 100% 100%;">

					   </div>
				   </div>

			   </div>
			   <div class="form-group">
				   <label for="personIdCard" class="col-sm-4 control-label">负责人身份证:</label>
				   <div class="col-sm-3">
                       <span style="line-height: 47px">${agent.personIdCard}</span>
				   </div>
				   <div style="clear: both"></div>
				   <div style="clear: both;width: 500px;margin-left: 162px;margin-top: 10px">
					   <div style="float: left">
                           <div class="image-control" onclick="picBig('${agent.idCardsImage[0].url}')"
                                style="background-image: url('${agent.idCardsImage[0].url}');background-size: 100% 100%;"></div>
					   </div>

					   <div  style="float: left;margin-left: 10px">
                           <div class="image-control" onclick="picBig('${agent.idCardsImage[1].url}')"
                                style="background-image: url('${agent.idCardsImage[1].url}');background-size: 100% 100%;">
						   </div>
					   </div>
				   </div>
			   </div>
	       </div> 
	       <div class="form-group">
               <div class="col-sm-10 text-center">
                <button type="button" id="backBtn" onclick="javascript:history.go(-1);" class="btn btn-primary">返回</button>
            </div>
        </div>
       </div>
    </form>
</div>
<script src="${ctx}/static/plugins/jQuery/jQuery-2.1.4.min.js"></script>
<script src="${ctx}/static/bootstrap/js/bootstrap.min.js"></script>
<!-- datatable -->
<script src="${ctx}/static/plugins/datatables/jquery.dataTables.js" type="text/javascript"></script>
<script src="${ctx}/static/plugins/datatables/dataTables.bootstrap.js" type="text/javascript"></script>
<script src="${ctx}/static/js/common/time/WdatePicker.js" type="text/javascript"></script>
<script src="${ctx}/static/plugins/validationEngine/jquery.validationEngine-zh_CN.js"></script>
<script src="${ctx}/static/plugins/validationEngine/jquery.validationEngine.js"></script>
<script src="${ctx}/static/plugins/layer/layer.js"></script>
<script>
    var sendDiv;
    $("#communityIsAble").hide();
    if ((${agent.agentLevelId}) == 3) {
        $("#communityIsAble").show();
    }


    $(function () {
    	$("#addBtn").click(function(){
	    	var flag = $("#addForm").validationEngine("validate");
	    	if(!flag){
	     		return false;
	    	}
    		//提交数据
        	$.ajax({
        		async       : false,
        		type 		: "POST",
                url: "${ctx}/api/supplier/add",
        		data 		: $("#addForm").serialize(),
        		success 	: function( d ) {
        			console.log(d);
        			if(d.code=="200"){
                        window.location.href = "${ctx}/api/role/listPage"
        			} else {
        				alert(d.message);
        			}
        		}
        	});
    	});
    });

    function openBigImg() {
        alert("big");

    }

    function picBig(url) {
        if (url == null || "" == url) {
            return;
        }
        $("#bigImg").attr('src', url);
        sendDiv = layer.open({
            title: "查看大图",
            type: 1,
            closeBtn: 0,
            resize: false,
            area: ['1240px', '700px'], //宽高
            content: $("#divCenter")
        });

    }
    function picClose() {
        layer.close(sendDiv);
    }

</script>
</body>
</html>